<template>
  <div id="container-equ-province-chart-1"></div>
</template>
<script>
import Highcharts, { color } from "highcharts/highstock";
export default {
  data() {
    return {};
  },
  created() {
    setTimeout(() => {
      // 初始化表格
      var chart = Highcharts.chart("container-equ-province-chart-1", {
        chart: {
          type: "column",
          backgroundColor: "#0000",
        },
        labels: {
          style: {
            color: "#fff",
          },
        },
        title: {
          text: "各省在用设备统计图",
          style: {
            color: "#2099D3",
          },
        },
        xAxis: {
          labels: {
            style: {
              color: "#2099D3",
            },
          },
          categories: [
            "北京市",
            "安徽省",
            "山东省",
            "四川省",
            "湖北省",
            "湖南省"
          ],
          crosshair: true,
        },
        yAxis: {
          min: 0,
          title: {
            text: "数量",
            style: {
              color: "#2099D3",
            },
          },
        },
        tooltip: {
          // head + 每个 point + footer 拼接成完整的 table
          headerFormat:
            '<span style="font-size:10px">{point.key}</span><table>',
          pointFormat:
            '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
            '<td style="padding:0"><b>{point.y} 台</b></td></tr>',
          footerFormat: "</table>",
          shared: true,
          useHTML: true,
        },
        plotOptions: {
          column: {
            borderWidth: 0,
          },
          bar:{
            // color:'#fff'
          }
        },
        series: [
          {
            name: "<b style='color:#2099D3'>起重机</b>",
            data: [
              850,550,780,1000,480,1000
            ],
          },
        ],
      });
    }, 0);
  },
};
</script>
